<#-- 充值产品特价设置模板  -->
<#include "../template/template_listPage.ftl">
<@header title="充值通道管理">
<style type="text/css">
    .table {
        padding: 1px;
        text-align: center;
    }

    .inputEdit {
        width: 60px;
    }
</style>
<style type="text/css">
    <#-- 鼠标菜单 -->
    #pop {
        height: 26px;
        line-height: 26px;
        width: 200px;
        position: absolute;
        background-color: #fff;
        color: #666;
        border: #414141 solid 1px;
    }

    #pop span {
        padding: 0px 5px;
        text-align: center;
        float: left;
        font-size: 12px;
    }

    #pop span:hover {
        color: #f60;
    }
</style>
<script type="text/javascript">
    $(document).ready(function () {
        $('#province').change(function () {
            var proviceCode = $('#province').val();
            loadArea(proviceCode, 'areaCity', '2', true);
        });
//        $('#areaCity').change(function () {
//            var areaCityCode = $('#areaCity').val();
//            loadArea(areaCityCode, 'city', '', true);
//        });
        loadArea('', 'province', '1', true);
        // document.getElementById("province").value = '${provinceCode!}';

        if ($.browser.msie && $.browser.version == "6.0") {
            setTimeout(function () {
                $("#province").val('${provinceCode!}');
                $("#phoneTypeCode").val('${phoneTypeCode!}');
                $('#province').change();
                setTimeout(function () {
                    $("#areaCity").val('${areaCityCode!}');
                }, 1);
            }, 1);
        } else {
            $("#province").val('${provinceCode!}');
            $("#phoneTypeCode").val('${phoneTypeCode!}');
            $('#province').change();
            $("#areaCity").val('${areaCityCode!}');
        }
    });

    /**
     *
     * @param parentCode 父代码
     * @param id
     * @param grade 1为省份
     * @param isTip
     */
    function loadArea(parentCode, id, grade, isTip) {
        if (parentCode == undefined) {
            parentCode = '';
        }
        if (grade == undefined) {
            grade = '';
        }
        if (parentCode == '' && grade == '') {
            return;
        }
        $.ajax({
            type:"POST",
            url:"${web_base}/recharge/area!loadArea.htm",
            async:false,
            data:"parentCode=" + parentCode + '&grade=' + grade,
            success:function (data) {
                if (data != undefined && data != null && data != '') {
                    var dataObj = eval('(' + data + ')');
                    var html = '';
                    if (isTip) {
                        html = '<option value="" selected="selected">--请选择--</option>';
                    }
                    $.each(dataObj, function (i, n) {
                        html = html + '<option value="' + n.code + '">' + n.areaName + '</option>';
                    });
                    $('#' + id).html(html);
                }
            }
        });
    }
</script>
<script type="text/javascript">
    function query() {
        $('#listForm').submit();
    }

    function validator() {
        var $validateErrorContainer = $("#validateErrorContainer");
        var $validateErrorLabelContainer = $("#validateErrorContainer ul");
        var $validateForm = $("#validateForm");
        var $tab = $("#tab");

        // Tab效果
        $tab.tabs(".tabContent", {
            tabs:"input"
        });

        // 表单验证
        $validateForm.validate({
            errorContainer:$validateErrorContainer,
            errorLabelContainer:$validateErrorLabelContainer,
            wrapper:"li",
            errorClass:"validateError",
            ignoreTitle:true,
            rules:{
                "category.name":{
                    required:true
                }
            },
            messages:{
                "category.name":{
                    required:"请填写商品类别名称"
                }
            },
            submitHandler:function (form) {
                $(form).find(":submit").attr("disabled", true);
                form.submit();
            }
        });
        <#if actionErrors??&&(actionErrors?size > 0)>
            $.dialog({type:"warn", content:"<#list errorMessages as list>${list}<br></#list>",
                modal:true, autoCloseTime:3000});
        </#if>
    }

    $(document).ready(function () {
    <#--$('#productType').val('${productType!}');-->
//        validator();
    });
    function handler(tp) {
        if (tp != 'close') {
            $('#goodsId').val(tp);
        }
    }
    function getSupplierRechargeMode(id, phoneTypeCode, areaCode) {
        // operationCode = '';
        if (areaCode == undefined) {
            areaCode = '';
        }
        $.ajax({
            type:"POST",
            url:"${web_base}/recharge/recharge_channel!supplierRechargeModeList.htm",
            async:false,
            data:"phoneType=" + phoneTypeCode + "&areaCode=" + areaCode,
            success:function (data) {
                var dataObj = eval("(" + data + ")");
                var html = '<div style="text-align: center;margin-top: 10px;"><select id="supplierRechargeModeSelect" name="" onchange="setValue(\'' + id + '\');">' +
                        '<option value="">-请选择-</option>';

                $.each(dataObj, function (i, n) {
                    html = html + '<option value="' + n.id + '">' + n.name + '</option>';
                });
                html = html + '</select></div>';
                ymPrompt.alert({message:html, width:300, height:110, title:'通道选择!', icoCls:'', handler:function () {
                }, iframe:false});
            }
        });
        $('#DELETE_' + id).val("false");
    }

    function setValue(id) {
        var checkIndex = $("#supplierRechargeModeSelect ").get(0).selectedIndex;
        if (checkIndex > 0) {
            $('#SRM_' + id).val($('#supplierRechargeModeSelect').val());
            $('#' + id).text($("#supplierRechargeModeSelect").find("option:selected").text());
        }
    }
    /**
     * 通道启用和停用
     * @param id
     * @param enable
     */
    function setEnable(id, enable) {
        if (enable == undefined || enable == "") {
            return;
        }
        var enableVal = $('#ENABEL_' + id).val();
        if (enable == 'true') {
            //启用
            if (enableVal == "true") {
                alert("通道已启用,无须再次启用");
                return;
            } else if (enableVal == "false") {
                enableVal = 'true';
                $('#' + id).css('color', '');
            } else {
                alert("设置无效");
                return;
            }

        } else if (enable == 'false') {
            //停用
            if (enableVal == "true") {
                enableVal = 'false';
                $('#' + id).css('color', 'red');
            } else if (enableVal == "false") {
                alert("通道已停用,无须再次停用");
                return;
            } else {
                alert("设置无效");
                return;
            }
        }
        $('#ENABEL_' + id).val(enableVal);
    }
    /**
     * 保存数据
     * @param id
     */
    function saveChange(id) {
        var hidden = $('input[type=hidden][id^="SRM_' + id + '"]');
        if (hidden.length > 0) {
            for (var i = 0; i < hidden.length; i++) {
                var value = hidden[i].value;//供货商提供的充值方式编号
                if (value != '') {
                    var str = id.split('_');
                    var areaCode = str[0];
                    var phoneTypeCode = str[1];
                    var inputIdStr = hidden[i].id.split("_");
                    var sort = inputIdStr[3];//顺序号
                    //alert(areaCode + " " + value + " " + phoneTypeCode);
                    var webNrrId = hidden[i].id.replace('SRM', 'NRR');
                    var webDeleteId = hidden[i].id.replace('SRM', 'DELETE');
                    var webEnabelId = hidden[i].id.replace('SRM', "ENABEL");
                    var nativeRchargeRuleId = $('#' + webNrrId).val();
                    var deleteIdVal = $('#' + webDeleteId).val();<#-- 删除标志 -->
                    var enableVal = $('#' + webEnabelId).val();<#-- 启用标志 -->
                    if (nativeRchargeRuleId == undefined || nativeRchargeRuleId == '') {
                        nativeRchargeRuleId = '';
                    }
                    var url = "${web_base}/recharge/recharge_channel!doAddOrUpdate.htm";
                    if (deleteIdVal == 'true') {
                        url = "${web_base}/recharge/recharge_channel!delete.htm";
                        $('#' + webNrrId).val('');
                        hidden[i].value = '';
                    }
                    var ajaxData = "areaCode=" + areaCode + "&phoneTypeCode=" + phoneTypeCode +
                            "&supplierRechargeModeId=" + value + "&nativeRchargeRuleId=" + nativeRchargeRuleId +
                            "&sort=" + sort + "&enable=" + enableVal;
                    $.ajax({
                        type:"POST",
                        url:url,
                        async:false,
                        data:ajaxData,
                        success:function (data) {
                            var dataObj = eval('(' + data + ')');
                            if (dataObj.result == "success" && deleteIdVal != 'true') {

                                $('#' + webNrrId).val(dataObj.nativeRechargeRuleId);
                                $('#' + webDeleteId).val('false');
                                $('#' + webEnabelId).val(enableVal);
                                if (enableVal == '') {
                                    enableVal = 'true';
                                }
                                $('#' + webEnabelId).val(enableVal);
                            }
                            if (dataObj.result == "success") {
                                $.dialog({type:"warn", content:"操作成功!", modal:true, autoCloseTime:3000});
                            }
                        }
                    });
                }
            }
        }
    }
    /**
     * 删除
     * @param id
     */
    function deleteNativeRechargeRule(id) {
    <#-- 删除标志(true:删除,false不删除) -->
        $('#DELETE_' + id).val("true");
        $('#' + id).text("未设置");
    }
</script>
</@header>
<body class="list">
<div class="body">
    <div class="listBar">
        <h1><span class="icon">&nbsp;</span>充值通道管理&nbsp;<span class="pageInfo">总记录数:<#if page??>${page.rowCount}</#if>
            (共<#if page??>${page.pageCount}</#if>页)</span></h1>
    </div>
    <div style="display: none;" id="validateErrorContainer" class="validateErrorContainer">
        <div class="validateErrorTitle">以下信息填写有误,请重新填写</div>
        <ul></ul>
    </div>
<@pageList page=(page!) id="listForm" action="${web_base}/recharge/recharge_channel!list.htm" query="areaQuery" pageSize=[phoneTypeList?size*3,phoneTypeList?size*4,phoneTypeList?size*5]>
    <input type="hidden" id="supplierRechargeMode" value="">

    <div class="operateBar">
        <label>类型:</label>
        <select id="phoneTypeCode" name="phoneTypeCode">
            <option value="">所有</option>
            <#list phoneTypeList as obj>
                <option value="${obj.code!}">${obj.name!}</option>
            </#list>
        </select>
        <label>区域选择:&nbsp;&nbsp;</label><#--<label>省:&nbsp;</label>
        <select id="" name="">
            <option value="">-请选择-</option>
        <#list areaMap.keySet() as key>
            <option value="${key}">${areaMap.get(key)?default("")}</option>
        </#list>
        </select>-->
        <span>省份:</span><select id="province" name="provinceCode">
        <option value="">--请选择--</option>
    </select><span>地区:</span><select
            id="areaCity" name="areaCityCode">
        <option value="">--请选择--</option>
    </select>&nbsp;
        <button type="button" id="submitForm">查询</button>
        &nbsp;
        <script type="text/javascript">
            $(document).ready(function () {
                $('#submitForm').click(function () {
                    //  if (typeof resetPageData_listForm != 'undefined' && resetPageData_listForm instanceof Function) {
                    //     resetPageData_listForm();
                    //  }
                    $('#listForm').submit();
                });
            });
        </script>
    <#--    <button type="button" onclick="batchSet();">全国快充说明</button>
 <button type="button" onclick="batchSet();">全国慢充说明</button> -->
        <button type="button" onclick="location.href='${web_base}/recharge/priority!list.htm'">全国通道优先级</button>
        <input type="hidden" name="isSearch" value="1">
    </div>
    <table class="listTable">
        <tr>
            <th nowrap="nowrap"><span class="sort">用户区域</span></th>
            <th nowrap="nowrap"><span class="sort">类型</span></th>
        <#--<th><span class="sort">说明</span></th>-->
            <#assign x=channelNumber/>
            <#list 1..x as i>
                <th nowrap="nowrap"><span class="sort">${i}</span></th>
            </#list>
            <th nowrap="nowrap"><span class="sort">操作</span></th>
        </tr>
        <#if channelList??>
            <#list channelList as obj>
                <#assign saveId=obj.areaCity.code+"_"+obj.phoneType.code/>
                <tr>
                    <td nowrap="nowrap">${obj.areaName!}</td>
                    <td nowrap="nowrap">${obj.phoneType.name!}</td>
                <#--<td nowrap="nowrap"><span class="spanLink">设置</span></td>-->
                    <#list 1..x as i>
                        <#assign htmlId=saveId+"_"+i/>
                        <td nowrap="nowrap">
                            <#assign flag=false>
                            <#assign srmId=""/>
                            <#assign tip="未设置"/>
                            <#assign enable=''/>
                            <#if obj.list??>
                                <#list obj.list as obj2>
                                    <#if obj2.sort?int==i>
                                        <#assign tip=(obj2.supplierRechargeModeName!)/>
                                        <#if tip==""><#assign tip="未设置"/></#if>
                                        <#assign nrrId=obj2.id/>
                                        <#assign srmId=obj2.supplierRechargeModeId/>
                                        <#assign enable=(obj2.enable?string("true","false"))/><#-- 是否启用 -->
                                        <#break >
                                    </#if>
                                </#list>
                            </#if>
                            <span id="${htmlId}" class="spanLink"
                                  <#if enable?? && enable=='false'>style="color: red;" </#if>
                                  onclick="getSupplierRechargeMode('${htmlId}','${obj.phoneType.code}','${obj.areaCity.code}');">${tip}</span>
                            <script type="text/javascript">
                                $(document).ready(function () {
                                    $('#${htmlId}').hover(function () {
                                        var html = '<span  onclick="getSupplierRechargeMode(\'${htmlId}\',\'${obj.phoneType.code}\',\'${obj.areaCity.code}\');" class="spanLink">插入</span>' +
                                                '<span onclick="deleteNativeRechargeRule(\'${htmlId}\');" class="spanLink">删除</span>' +
                                                '<span onclick="setEnable(\'${htmlId}\',\'true\')" class="spanLink">启用</span>' +
                                                '<span onclick="setEnable(\'${htmlId}\',\'false\')" class="spanLink">停用</span>' <#--+
                                                '<span onclick="" class="spanLink">通道属性</span>' -->;
                                        $('#pop').html(html);
                                        hover(this);
                                    });
                                });
                            </script>
                            <input type="hidden" id="NRR_${htmlId}" value="${nrrId!}"><#-- 本地充值供货规则主键 -->
                            <input type="hidden" id="SRM_${htmlId}" value="${srmId}"><#-- 供货商提供的充值方式编号 -->
                            <input type="hidden" id="DELETE_${htmlId}" value="false"><#-- 删除标志(true:删除,false不删除) -->
                            <input type="hidden" id="ENABEL_${htmlId}"
                                   value="${enable!}"><#-- 是否启用(true:启用,false停用) -->
                        </td>
                    </#list>
                    <td nowrap="nowrap"><span class="spanLink"
                                              onclick="saveChange('${saveId!}');">保存变更</span></td>
                </tr>
            </#list>
        </#if>
    </table>
</@pageList>
    <div style="margin-left: 5px;margin-top: 50px;position: absolute;display: none;">
        <button type="button">增加分组</button>
    </div>
</div>
<script type="text/javascript">
    <#-- 鼠标菜单 -->
    $(function () {
        $("#pop a").click(function () {
            $("#pop").hide();
        });
        $("#pop").hover(function () {
        }, function () {
            $(this).hide();
        });
    });

    function hover(widget) {
        showTip(widget);
        $("#pop").show();
    }

    function showTip(tt) {
        var pop = document.getElementById("pop");
        var t = tt.offsetTop; //TT控件的定位点高
        var h = tt.clientHeight; //TT控件本身的高
        var l = tt.offsetLeft; //TT控件的定位点宽
        var ttyp = tt.type; //TT控件的类型
        while (tt = tt.offsetParent) {
            t += tt.offsetTop;
            l += tt.offsetLeft;
        }
        var top = (ttyp == "image") ? t + h : t + h + 6; //层的 Y 坐标
        pop.style.top = top + "px";
        pop.style.left = l + 40 + "px"; //层的 X 坐标
        pop.style.display = "block"; //层显示
        // pop.innerText = window.event.srcElement.alt;
    }
</script>
<#-- 浮动菜单  -->
<div id="pop" style="display:none;z-index: 20;">
    <!--    <span style="cursor: pointer;color: #336699;" onclick="">插入</span>
    <span style="cursor: pointer;color: #336699;" onclick="">删除</span>
    <span style="cursor: pointer;color: #336699;" onclick="">启用</span>
    <span style="cursor: pointer;color: #336699;" onclick="">停用</span>
    <span style="cursor: pointer;color: #336699;" onclick="">通道属性</span>
    -->
</div>
</body>
</html>